import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Cascader } from 'antd';


class CascaderSelect extends Component {

  buildOptions = (treeMenus, parentNode = null)=> {
    const options = [];
    if(treeMenus) {
      for(let i=0; i<treeMenus.length; i++) {
        const { $typeSpec } = treeMenus[i];
        // console.log('buildOptions', treeMenus[i], $typeSpec)
        if(!$typeSpec.endsWith('EnergyArea') && !$typeSpec.endsWith('EnergyCategory')) {
          break;
        }
        const node = {
          value: treeMenus[i].$handle + '||' + ($typeSpec.endsWith('EnergyCategory')?treeMenus[i].energyCategoryType:''),
          label: treeMenus[i].title,
          parent: parentNode
        }
        if(treeMenus[i].children && treeMenus[i].children.length > 0) {
          const children = this.buildOptions(treeMenus[i].children, node);
          if(children && children.length > 0) {
            node.children = children;
          }
        }
        options.push(node);
      }
    }
    return options;
  }

  render() {
    const { treeMenus, menuChangeCallback } = this.props;
    const options = this.buildOptions(treeMenus);
    return (
      <Cascader options={options} onChange={menuChangeCallback} placeholder='请选择' />
    );
  }
}

CascaderSelect.propTypes = {
  treeMenus: PropTypes.array.isRequired,
  menuChangeCallback: PropTypes.func.isRequired,
};

export default CascaderSelect;
